import React, { Component } from "react";
import PubSub from "pubsub-js";
import Styles from "./index.module.css";

export default class List extends Component {
  state = {
    users: [],
  };
  componentDidMount() {
    PubSub.subscribe('search',(msg,data)=>{
      console.log(data,'data')
      this.setState({users:data})
    })
  }
  componentWillUnmount(){
    PubSub.unsubscribe('search')
  }
  render() {
    return (
      <div className={Styles.outer}>
        {this.state.users?.map((user) => {
          return (
            <div key={user.id}>
              <a href={user.html_url} rel="noreferrer">
                <img
                  src={user.avatar_url}
                  alt={user.html_url}
                  style={{ width: "100px" }}
                ></img>
              </a>
              <p>{user.login}</p>
            </div>
          );
        })}
      </div>
    );
  }
}
